/**start==动态生成验证码**/
//生成随机数
function randomNum(min, max) {
    return Math.floor(Math.random() * (max - min) + min);
}

//生成随机颜色RGB分量
function randomColor(min, max) {
    var _r = randomNum(min, max);
    var _g = randomNum(min, max);
    var _b = randomNum(min, max);
    return "rgb(" + _r + "," + _g + "," + _b + ")";
}

//先阻止画布默认点击发生的行为再执行drawPic()方法
document.getElementById("canvas").onclick = function (e) {
    e.preventDefault();
    drawPic();
};

function drawPic() {
    //获取到元素canvas
    var $canvas = document.getElementById("canvas");
    var _str = "ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnpqrstuvwxyz0123456789";//设置随机数库
    var _picTxt = "";//随机数
    var _num = 4;//4个随机数字
    var _width = $canvas.width;
    var _height = $canvas.height;
    var ctx = $canvas.getContext("2d");//获取 context 对象
    ctx.textBaseline = "bottom";//文字上下对齐方式--底部对齐
    ctx.fillStyle = randomColor(180, 240);//填充画布颜色
    ctx.fillRect(0, 0, _width, _height);//填充矩形--画画
    for (var i = 0; i < _num; i++) {
        var x = (_width - 10) / _num * i + 10;
        var y = randomNum(_height / 1.2, _height);
        var deg = randomNum(0, 25);
        var txt = _str[randomNum(0, _str.length)];
        _picTxt += txt;//获取一个随机数
        ctx.fillStyle = randomColor(10, 100);//填充随机颜色
        ctx.font = randomNum(20, 40) + "px SimHei";//设置随机数大小，字体为SimHei
        ctx.translate(x, y);//将当前xy坐标作为原始坐标
        ctx.rotate(deg * Math.PI / 180);//旋转随机角度
        ctx.fillText(txt, 0, 0);//绘制填色的文本
        ctx.rotate(-deg * Math.PI / 180);
        ctx.translate(-x, -y);
    }
    for (var i = 0; i < _num; i++) {
        //定义笔触颜色
        ctx.strokeStyle = randomColor(90, 180);
        ctx.beginPath();
        //随机划线--4条路径
        ctx.moveTo(randomNum(0, _width), randomNum(0, _height));
        ctx.lineTo(randomNum(0, _width), randomNum(0, _height));
        ctx.stroke();
    }
    for (var i = 0; i < _num * 10; i++) {
        ctx.fillStyle = randomColor(0, 255);
        ctx.beginPath();
        //随机画原，填充颜色
        ctx.arc(randomNum(0, _width), randomNum(0, _height), 1, 0, 2 * Math.PI);
        ctx.fill();
    }
    picCode = _picTxt;
    return _picTxt;//返回随机数字符串
}

/**end==动态生成验证码**/